<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--准备好一个"容器"-->

<div id="test"></div>

<!--引入库-->
<script type="text/javascript" src="../js/react.development.js"></script>
<script type="text/javascript" src="../js/react-dom.development.js"></script>
<script type="text/javascript" src="../js/babel.min.js"></script>


<script type="text/javascript">
    //创建一个Person类
    class Person {
        //构造器方法
        constructor(name, age) {
            //构造器中的this是谁?————类的实例对象
            this.name = name;
            this.age = age;
        }

        //一般方法
        speak() {
            //通过Person实例调用speak时，speak中的this就是Person实例
            console.log(`我叫${this.name},今年${this.age}岁`);
        }
    }


    //创建一个Student继承Person
    class Student extends Person {
        constructor(name, age, grade) {
            super(name, age);
            this.grade = grade;
        }

        speak() {
            //通过Person实例调用speak时，speak中的this就是Person实例
            console.log(`我叫${this.name},今年${this.age}岁,今年上${this.grade}`);
        }

        study(){
            console.log("用功学习");
        }
    }

    //创建一个实例对象
    const person1 = new Person("tom", 3);
    const person2 = new Person("jerry", 1);

    const student1 = new Student("kitty",7,"初一");

    console.log(person1);
    console.log(person2);
    console.log(student1);

    person1.speak();
    person2.speak();

    student1.speak();
    student1.study();

    class Car{
        constructor(name,price){
            this.name=name;
            this.price=price;
        }

        wheel = 4;
    }

    const  car1 = new Car("追风",199);
    console.log(car1);
</script>

</body>
</html>
